<template>
  <div id="dismantling">  
      <div  style="display:flex;margin-bottom:10px;align-items: center;">
            <img class="top_img" src="@/assets/images/a8.png" style="width:35px;height:35px;margin-right:10px;"/>
            <div style="line-height: 40px;font-weight:bold:">拆解记录</div>
     </div> 
      <el-form ref="form" :model="form" label-width="80px">  
     <el-row> 
          <el-col :span="8" style="display:flex;">

           <el-form-item label-width="0px" style="margin-left:10px;">
            <el-input v-model="form.bh" :placeholder="variable_name4 + '编号'"></el-input>
          </el-form-item>

          <el-form-item label-width="0px" style="margin-left:10px;">
            <el-input v-model="form.phone" placeholder="姓名/手机号"></el-input>
          </el-form-item>

           <div class="custom_button2"  style="margin-left:10px;" @click="search_but()"></div>
        </el-col>
        <el-col :span="16" style="text-align: right;"> 
              <el-button type="primary" class="custom_color_button1" style="margin-bottom:10px;" @click="bl_but()">拆解比例</el-button>   
              <el-button type="primary" class="custom_color_button1" style="margin-bottom:10px;" @click="jd_but()">{{ variable_name2 }}拆解比例</el-button> 
              <el-button type="primary" class="custom_color_button1" style="margin-bottom:10px;" @click="gm_but()">{{ variable_name1 }}拆解比例</el-button>
              <el-button type="primary" class="custom_color_button1" style="margin-bottom:10px;" @click="time_but()">显示时间</el-button>         
        </el-col>  
       
    </el-row>
      </el-form>
   
   <!-- 渲染数据list -->
   <dismantling-list :datalist="datalist" @up_list_fun="list_fun"> </dismantling-list>

   <div style="margin-top:20px;text-align: center;">
            <el-pagination
                background
                @current-change="handleCurrentChange"
                :page-size="10"  
                layout="prev, pager, next, jumper"
                :total="count">
            </el-pagination>
     </div>

      <!-- 添加 -->
        <el-dialog :title="variable_name2 + '拆解比例'" :visible.sync="mtk_jd"  width="400px">
            <div style="width:100%;"> 

            <el-form ref="form"   label-width="0px" style="width:100%;">
                 <el-form-item label="" label-width="0px" >
                    <el-input v-model="mtk_jd_form.number" placeholder="请输入"></el-input>
                </el-form-item> 
            </el-form>
               <div style="text-align: center;width:50%;margin:auto;margin-top:20px;">
                  <el-button type="primary" class="custom_color_button" style="width:100%;" @click="jd_qr_but">确认</el-button>
                 </div>
            </div> 
        </el-dialog>


        <!-- 添加 -->
        <el-dialog :title="variable_name1 + '拆解比例'" :visible.sync="mtk_gm"  width="400px">
            <div style="width:100%;"> 

            <el-form ref="form"   label-width="0px" style="width:100%;">
                 <el-form-item label="" label-width="0px" >
                    <el-input v-model="mtk_gm_form.number" placeholder="请输入"></el-input>
                </el-form-item> 
            </el-form>
               <div style="text-align: center;width:50%;margin:auto;margin-top:20px;">
                  <el-button type="primary" class="custom_color_button" style="width:100%;" @click="gm_qr_but">确认</el-button>
                 </div>
            </div> 
        </el-dialog>


         <!-- 拆解比例 -->
        <el-dialog title="拆解比例" :visible.sync="mtk_bl"  width="500px">
            <div style="width:100%;"> 

            <el-form ref="form"  label-width="100px" style="width:100%;">
                    
                    <el-form-item  :label="variable_name4">
                      <el-row>
                        <el-col :span="5" style="text-align: center;">
                            拆解比例
                        </el-col>
                        <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                        <el-col  :span="5" style="text-align: center;">
                            拆分比例
                        </el-col>
                       <el-col class="line" :span="2" style="text-align: center;">-</el-col>
                        <el-col :span="5" style="text-align: center;">
                            拆解数量
                        </el-col>
                        <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                        <el-col  :span="5" style="text-align: center;">
                            拆分数量
                        </el-col>
                      </el-row>
                    </el-form-item>

                    <el-form-item  v-for="(item,index) in bl_arr" :key="index" :label="item.title">
                       <el-row>
                        <el-col  :span="5">
                          <el-input v-model="item.reduce_dismantling_scale" placeholder="拆解比例" @blur="proving(item.reduce_dismantling_scale,1,index)"></el-input>
                        </el-col>
                        <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                        <el-col  :span="5">
                           <el-input v-model="item.reduce_split_scale" placeholder="拆分比例" @blur="proving(item.reduce_split_scale,2,index)"></el-input>
                        </el-col>
                        <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                        <el-col  :span="5">
                          <el-input v-model="item.can_reduce_number" placeholder="拆解数量" ></el-input>
                        </el-col>
                        <el-col class="line" :span="1" style="text-align: center;">-</el-col>
                        <el-col  :span="5">
                           <el-input v-model="item.can_split_number" placeholder="拆分数量"></el-input>
                        </el-col>
                       </el-row>
                    </el-form-item>    



                                      
                </el-form>
               <div style="text-align: center;width:50%;margin:auto;margin-top:20px;">
                  <el-button type="primary" class="custom_color_button" style="width:100%;" @click="bl_qr_but">确认</el-button>
                 </div>
            </div> 
        </el-dialog>

      
  </div>
</template>

<script>
import DismantlingList from '@/view/Exchangeorder/DismantlingList'
export default {
  name: 'dismantling',
  data () {
    return {
        datalist:[],
         page:1,
        count:0,
        form:{
           bh:'',
           phone:''
        },
        mtk_jd:false,
        mtk_jd_form:{
          number:'',
        },
        mtk_gm:false,
        mtk_gm_form:{
          number:''
        },
        mtk_bl:false,
        bl_arr:[]
    }
  },
 components:{
    DismantlingList
  },
  created(){
     this.list_fun()
  },
  mounted (){
    
  },
  methods: {
      list_fun(){
          this.post("/split_log/listOfBlend", {
              account:this.form.phone,
              new_pid:this.form.bh,
              page:this.page
	        }).then(res => {
            this.count = res.result.count
            this.datalist = res.result.list
            //console.log(res)
         })
      },
      search_but(){
           this.page = 1
           this.list_fun()
      },
      xs_fun(){
           this.post("/split_log/reduceScale", {                
                }).then(res => {
                  // console.log(res.result,"fff")
                   this.mtk_jd_form.number = res.result.reduce_gdb_scale
                   this.mtk_gm_form.number = res.result.reduce_kmb_scale
             })
      },
      jd_but(){
           this.mtk_jd = true
           this.xs_fun()
      }, 
      jd_qr_but(){
            this.post("/split_log/setReduceGdbScale", {
                    scale:this.mtk_jd_form.number
                }).then(res => {

                    if(res.error_code == 0){
                      this.open1(res.result,'success')  //提示框
                      this.mtk_jd = false
                    }else {
                    this.open1(res.message,'warning')
                }

             })
      },
      gm_but(){
         this.mtk_gm = true
         this.xs_fun()
      },
      gm_qr_but(){
          this.post("/split_log/setReduceKmbScale", {
                    scale:this.mtk_gm_form.number
                }).then(res => {

                    if(res.error_code == 0){
                      this.open1(res.result,'success')  //提示框
                      this.mtk_gm = false
                    }else {
                    this.open1(res.message,'warning')
                }

             })
      },
      time_but(){
         this.$router.push({
          path: '/index/seetime',
          query: {
            name:'显示时间',
          }
        })
      },
      bl_fun(){
          this.post("/split_log/listOfReduceScale", {          
	        }).then(res => {
            console.log( res.result,"fff")
            this.bl_arr = res.result
            //console.log(res.result)
         })
      },
      bl_but(){
         this.mtk_bl = true
          this.bl_fun()   
      },
      bl_qr_but(){
          this.post("/split_log/setReduceScale", {
                    arr:this.bl_arr
                }).then(res => {

                    if(res.error_code == 0){
                      this.open1(res.result,'success')  //提示框
                      this.mtk_bl = false
                    }else {
                    this.open1(res.message,'warning')
                }

             })
      },
      proving(num,type,index){
          if(0<=num && num<=1){
                console.log(num)
          }else{
             this.open1("比例在0-1之间",'warning')
             if(type == 1){
                this.bl_arr[index].reduce_dismantling_scale = 0
             }else if(type == 2){
                 this.bl_arr[index].reduce_split_scale = 0
             }
          }
         
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        this.page = val
        this.list_fun()
        console.log(`当前页: ${val}`);
      }
     

  }
}
</script>


<style scoped>

</style>
